<template>
  <page-header-wrapper :title="false">
    <a-card>
      <a-tabs type="card" @change="onTabs">
        <a-tab-pane key="10">
            <span slot="tab">
              商标业务
            </span>
        </a-tab-pane>
        <a-tab-pane key="20">
            <span slot="tab">
              专利业务
<!--              <a-badge count="0/0" :number-style="{ backgroundColor: '#1890ff' }"></a-badge>-->
            </span>
        </a-tab-pane>
        <a-tab-pane key="30">
            <span slot="tab">
              版权业务
<!--              <a-badge count="4/0" :number-style="{ backgroundColor: '#1890ff' }"></a-badge>-->
            </span>
        </a-tab-pane>
        <a-tab-pane key="40">
            <span slot="tab">
              设计业务
<!--              <a-badge count="3/0" :number-style="{ backgroundColor: '#1890ff' }"></a-badge>-->
            </span>
        </a-tab-pane>
        <a-tab-pane key="50">
            <span slot="tab">
              国际业务
<!--              <a-badge count="0/0" :number-style="{ backgroundColor: '#1890ff' }"></a-badge>-->
            </span>
        </a-tab-pane>
        <a-tab-pane key="60">
            <span slot="tab">
              高新业务
              <!--              <a-badge count="0/0" :number-style="{ backgroundColor: '#1890ff' }"></a-badge>-->
            </span>
        </a-tab-pane>
        <a-tab-pane key="70">
            <span slot="tab">
              资产评估
              <!--              <a-badge count="0/0" :number-style="{ backgroundColor: '#1890ff' }"></a-badge>-->
            </span>
        </a-tab-pane>
        <a-tab-pane key="80">
            <span slot="tab">
              ISO
              <!--              <a-badge count="0/0" :number-style="{ backgroundColor: '#1890ff' }"></a-badge>-->
            </span>
        </a-tab-pane>
        <a-tab-pane key="90">
          <span slot="tab">国际商标</span>
        </a-tab-pane>
        <a-tab-pane key="100">
          <span slot="tab">国际专利</span>
        </a-tab-pane>
        <a-tab-pane key="110">
          <span slot="tab">3A</span>
        </a-tab-pane>
        <a-tab-pane key="120">
          <span slot="tab">400</span>
        </a-tab-pane>
        <a-tab-pane key="300">
            <span slot="tab">
              其他业务
<!--              <a-badge count="0/0" :number-style="{ backgroundColor: '#1890ff' }"></a-badge>-->
            </span>
        </a-tab-pane>
        <a-tab-pane key="0">
            <span slot="tab">
              汇总
              <!--              <a-badge count="0/0" :number-style="{ backgroundColor: '#1890ff' }"></a-badge>-->
            </span>
        </a-tab-pane>
      </a-tabs>
      <Trademark v-if="activeKey == 10"></Trademark>
      <Patent v-if="activeKey == 20"></Patent>
      <Copyright v-if="activeKey == 30"></Copyright>
      <Design v-if="activeKey == 40"></Design>
      <International v-if="activeKey == 50"></International>
      <Gx v-if="activeKey == 60"></Gx>
      <Zc v-if="activeKey == 70"></Zc>
      <Iso v-if="activeKey == 80"></Iso>
      <gj-trademark v-if="activeKey == 90"></gj-trademark>
      <gj-patent v-if="activeKey == 100"></gj-patent>
      <three-a v-if="activeKey == 110"></three-a>
      <four-zero-zero v-if="activeKey == 120"></four-zero-zero>
      <Other v-if="activeKey == 300"></Other>
      <All v-if="activeKey == 0"></All>
    </a-card>
  </page-header-wrapper>
</template>

<script>
  import { Trademark, Patent, Copyright, Design, International, Other, Gx, Zc, Iso, All, GjTrademark, GjPatent, ThreeA, FourZeroZero } from './components'

  export default {
    components: {
      Trademark,
      Patent,
      Copyright,
      Design,
      International,
      Other,
      Zc,
      Gx,
      Iso,
      All,
      GjTrademark,
      GjPatent,
      ThreeA,
      FourZeroZero
    },
    name: 'BusinessList',
    data () {
      return {
        advanced: false,
        queryParam: {},
        selectedRowKeys: [],
        activeKey: '10'
      }
    },
    methods: {
      onTabs (key) {
        this.activeKey = key
      },
      toggleAdvanced () {
        this.advanced = !this.advanced
      },
      onSelectChange (selectedRowKeys) {
        this.selectedRowKeys = selectedRowKeys
      }
    }
  }
</script>

<style scoped>

</style>
